<template>
  <div class="banner">
      <div class="banner_item">
          <img src="../assets/images/abanner01.jpg" @click="jump('https://cx.12306.cn/tlcx/index.html')"/>
      </div>
      <div class="banner_item">
          <img src="../assets/images/abanner02.jpg" @click="jump('https://exservice.12306.cn/excater/index.html')"/>
      </div>
      <div class="banner_item">
          <img src="../assets/images/abanner03.jpg" @click="jump('https://kyfw.12306.cn/otn/resources/login.html')"/>
      </div>
      <div class="banner_item">
          <img src="../assets/images/abanner04.jpg" @click="jump('https://www.12306.cn/index/view/ticket/zt_ecard.html')"/>
      </div>
  </div>
</template>

<script>
export default {
    methods: {
    jump(url) {
      window.location.href = url
    }
  }
}
</script>

<style scoped lang="scss">
    .banner{
        margin-left: 19.5%;
        width: 1200px;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        border-top: 1px solid #ffffff;
        padding: 0 10px;
        .banner_item{
            width: 50%;
            display: flex;
            padding-top: 15px;
            flex-direction: row;
            img{
                width: 590px;
                height: 160px;
            }
        }
    }
</style>